<template>
<div class="box-padding">
    <Form label-position="top">
        <Header class="header-cont main__title--top">{{$route.params.name}}</Header>
    <Row :gutter="40">
        <Col span="8">
        <FormItem label="项目名称">
            <Input v-model="$route.params.projectName" placeholder="请输入项目名称" disabled />
        </FormItem>
        </Col>
        <Col span="8">
        <FormItem label="专业类型" :required="$route.params.type == 'details' ? false : true">
            <Input v-model="obj.wbsName" v-if="$route.params.type == 'details'" :disabled="$route.params.type == 'details' ? true : false" />
            <Select v-model="obj.wbsId" v-if="$route.params.type != 'details'" @on-open-change="projectTypeList" not-found-text="暂无专业类型" ref="treeSelectWbs" placeholder="请选择" :disabled="$route.params.type == 'details' ? true : false">
                <Option v-for="item in list1" :value="obj.wbsId" :key="item.id" style="display: none;">{{ item.title }}</Option>
                <Tree :data="wbsList" ref="Tree" :load-data="loadData" style="padding-left:20px" v-if="wbsList.length > 0" @on-select-change="checkWbs"></Tree>
            </Select>
        </FormItem>
        </Col>
    </Row>
    <Row :gutter="40">
        <Col span="8">
        <FormItem label="编号" :required="$route.params.type == 'details' ? false : true">
            <Input v-model="obj.code" placeholder="请输入编号"
            :disabled="$route.params.type != 'add' ? true : false" />
        </FormItem>
        </Col>
        <Col span="8">
        <FormItem label="名称" :required="$route.params.type == 'details' ? false : true">
            <Input v-model="obj.name" placeholder="请输入名称"
            :disabled="$route.params.type == 'details' ? true : false" />
        </FormItem>
        </Col>
        <Col span="8">
        </Col>
    </Row>
    <Row :gutter="40">
        <Col span="8">
        <FormItem label="风险等级" :required="$route.params.type == 'details' ? false : true">
            <Select v-model="obj.dictRiskGrade" :disabled="$route.params.type == 'details' ? true : false">
            <Option v-for="(item, index) in leveList" :key="index" :value="item.code">{{ item.name }}</Option>
        </Select>
        </FormItem>
        </Col>
        <Col span="8">
        <FormItem label="是否为控制工程">
            <Select v-model="obj.dictControlEngineering"
                :placeholder="(($route.params.type == 'add' || $route.params.type == 'details') && obj.dictControlEngineering == '')?'':'请选择'"
                :disabled="($route.params.type == 'details' || $route.query.isProject == false || obj.isUnitChild == false) ? true : false">
            <Option v-for="(item, index) in isKongZhi" :key="index" :value="item.code">{{ item.name }}</Option>
        </Select>
        </FormItem>
        </Col>
        <Col span="8">
        </Col>
    </Row>
    <Row :gutter="40">
        <Col span="8">
        <FormItem label="经度">
            <Input v-model="obj.longitude" placeholder="请输入经度" :disabled="$route.params.type == 'details' ? true : false" />
        </FormItem>
        </Col>
        <Col span="8">
        <FormItem label="纬度">
            <Input v-model="obj.latitude" placeholder="请输入纬度" :disabled="$route.params.type == 'details' ? true : false" />
        </FormItem>
        </Col>
        <Col span="8">
        </Col>
    </Row>
    <Row :gutter="40">
        <Col span="8">
        <FormItem label="半径">
            <Input v-model="obj.radius" placeholder="请输入半径"
            :disabled="$route.params.type == 'details' ? true : false" />
        </FormItem>
        </Col>
        <Col span="8">
        </Col>
        <Col span="8">
        </Col>
    </Row>
    <Row :gutter="40">
        <Col span="8">
        <FormItem label="计划开始时间">
            <DatePicker v-model="obj.planedStartDate" type="date"
            placeholder="请选择计划开始时间" style="width:100%"
            :disabled="$route.params.type == 'details' ? true : false"></DatePicker>
        </FormItem>
        </Col>
        <Col span="8">
        <FormItem label="计划结束时间">
        <DatePicker v-model="obj.planedEndDate" type="date" placeholder="请选择计划结束时间" style="width:100%" :disabled="$route.params.type == 'details' ? true : false"></DatePicker>
        </FormItem>
        </Col>
        <Col span="8">
        </Col>
    </Row>
    <Row :gutter="40">
        <Col span="8">
        <FormItem label="实际开始时间">
        <DatePicker v-model="obj.practicalStartDate" type="date" placeholder="请选择实际开始时间" style="width:100%" :disabled="$route.params.type == 'details' ? true : false"></DatePicker>
        </FormItem>
        </Col>
        <Col span="8">
        <FormItem label="实际结束时间">
        <DatePicker v-model="obj.practicalEndDate" type="date" placeholder="请选择实际结束时间" style="width:100%" :disabled="$route.params.type == 'details' ? true : false"></DatePicker>
        </FormItem>
        </Col>
        <Col span="8">
        </Col>
    </Row>
    <Row :gutter="40">
        <Col span="16">
        <FormItem label="概况说明">
        <Input v-model="obj.description" placeholder="请输入概况说明" :rows="4" type="textarea" :disabled="$route.params.type == 'details' ? true : false" />
        </FormItem>
        </Col>
        <Col span="8">
        </Col>
    </Row>
    <div class="role-bottom" v-if="$route.params.type != 'details'">
        <Button type="primary" @click="save">保存</Button>
        <Button style="margin-left:20px;" @click="cancel">取消</Button>
    </div>
    </Form>

</div>
</template>

<script>
// import Treeselect from '@riophae/vue-treeselect'
// import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import {
    mapMutations
} from 'vuex'
import closeTag from '../../../mixins/closeTag'
import crudMixin from '../../../mixins/crudMixin'
import Utils from '../../../common/util'
export default {
    mixins: [closeTag, crudMixin],
    data() {
        return {
            params: {
                whereMap: {
                    parentId: '0'
                }
            },
            wbsList: [],
            list1: [],
            obj: {
                code:''
            },
            isKongZhi: []
        }
    },
    watch: {},
    mounted() {
        if(this.$route.params.type != 'add'){
            this.unitTreeDetail()
        }
        this.dictTypeList('RISK_GRADE')
        this.getListByTypeCode('IS_CONTROL_ENGINEERING')
        this.projectTypeList(this.$route.params.id)
        if(!this.$route.query.isProject){
            this.obj.dictControlEngineering = this.$route.query.dictControlEngineering
        }
        if (this.$route.params.type === 'add') {
            this.getUnitTreeCode()
        }
    },
    methods: {
        ...mapMutations(['closeTag']),
        closetab() {
            this.closeTag({
                name: this.$route.name,
                params: this.$route.params,
                query: this.$route.query
            });
        },
        //单位工程code码生成
        getUnitTreeCode(){
            let params = {
                projectId : this.$route.params.projectId,
                parentId : this.$route.params.parentId
            }
            this.$api.UnitProject.unitTreeCode(params).then(res => {
                if (res.code == 200) {
                    this.obj.code = res.data
                } else {
                    this.$Message.error(res.data.msg)
                }
            })
        },
        projectTypeList(value) {
            if (value) {
                if (this.$route.params.projectId) {
                    let res = {
                        currentPage: 1,
                        pageSize: 99999,
                        whereMap: {
                            projectId: this.$route.params.projectId,
                            parentId: 0
                        }
                    }
                    this.$api.WorkstationLedger.professionalTypeList(res).then(res => {
                        if (res.code == 200) {
                            res.data.resultObject.map(r => {
                                this.$set(r, 'title', r.name)
                                if (r.hasChildren) {
                                    this.$set(r, 'children', [])
                                    this.$set(r, 'loading', false)
                                }
                            })
                            this.wbsList = [{
                                title: '标准WBS',
                                parentId: 0,
                                hasChildren: false,
                                loading: false,
                                expand: true,
                                children: res.data.resultObject
                            }]
                        } else {
                            this.$Message.error(res.data.msg)
                        }
                    })
                } else {
                    this.$Message.warning('请先选择项目名称')
                }
            }
        },
        loadData(item, callback) {
            let params = {
                currentPage: 1,
                pageSize: 99999,
                whereMap: {
                    projectId: this.ledgerObj.projectId,
                    parentId: item.id
                }
            }
            let data = []
            this.$api.WorkstationLedger.professionalTypeList(params).then(res => {
                if (res.code == 200) {
                    callback(this.getTree(res.data.resultObject))
                } else {
                    this.$Message.error(res.data.msg)
                }
            })
        },
        getTree(tree) {
            return tree.map(node => {
                node.title = node.name
                if (node.hasChildren) {
                    node.loading = false
                    node.children = []
                }
                return node
            })
        },
        checkWbs(data) {
            if(data[0].title == '标准WBS'){
                this.$refs.treeSelectWbs.visible = false
            }else{
                this.list1 = []
                let id = data[0].id
                let title = data[0].title
                this.list1.push({
                    id,
                    title
                })
                this.obj.wbsId = id
                this.$refs.treeSelectWbs.visible = false
            }
        },
        // 单位工程详情
        unitTreeDetail() {
            if (this.$route.params.name === '日志详情'){
                this.$api.operationLog
                    .getOperationLogDetail(this.$route.params.id)
                    .then(res => {
                        if (res.code === 200) {
                            let data = JSON.parse(res.data.params)
                            res.data.startTime = this.$time(
                                new Date(data.startTime),
                                'yyyy-MM-dd'
                            )
                            res.data.endTime = this.$time(
                                new Date(data.endTime),
                                'yyyy-MM-dd'
                            )
                            this.obj = {
                                ...data
                            }
                        } else {
                            this.$Message.error(res.message)
                        }
                    })
            }else{
                this.$api.UnitProject.unitTreeDetail(this.$route.params.id).then(
                    resp => {
                        if (resp.code == 200) {
                            this.obj = resp.data
                            this.list1 = [{
                                id: resp.data.wbsId,
                                title: resp.data.wbsName
                            }]
                        } else {
                            this.$Message.warning(resp.message)
                        }
                    }
                )
            }
        },
        //  是否为控制工程
        getListByTypeCode(code) {
            this.$api.UnitProject.getListByTypeCode(code).then(resp => {
                if (resp.code == 200) {
                    this.isKongZhi = resp.data
                }
            })
        },
        // 取消
        // cancel() {
        //     let params = {
        //         name: this.$route.params.name,
        //         id: this.$route.params.id,
        //         type: this.$route.params.type
        //     }
        //     this.closetabParams('add-unit-project', params)
        // },
        // 取消
        cancel() {
            this.closetab()
            this.$router.push({
                path: '/project-management/engineering/unit-project'
            })
        },
        // 编辑/新增
        save() {
            if (this.obj.code.length > 30) {
                this.$Message.warning("单位工程编号不能超过30个字符！");
                return;
            }
            if (!this.$regex.numberAndEnglishRegEx(this.obj.code)) {
                this.$Message.warning("单位工程编号只能包含英文字母和数字！");
                return;
            }
            if (!this.obj.name) {
                this.$Message.warning("单位工程名称不能为空！");
                return;
            }
            if (this.obj.name.length > 60) {
                this.$Message.warning("单位工程名称不能超过60个字符！");
                return;
            }
            if (!this.obj.wbsId) {
                this.$Message.warning("专业类型不能为空！");
                return;
            }
            if (!this.obj.dictRiskGrade) {
                this.$Message.warning("风险等级不能为空！");
                return;
            }
            if (this.obj.longitude && !this.$regex.longitude(this.obj.longitude)) {
                this.$Message.warning("经度格式不对！");
                return;
            }
            if (this.obj.latitude && !this.$regex.latitude(this.obj.latitude)) {
                this.$Message.warning("维度格式不对！");
                return;
            }
            if (this.obj.radius && !this.$regex.radiusReg(this.obj.radius)) {
                this.$Message.warning("半径格式不对！");
                return;
            }

            if (this.obj.description && this.obj.description.length > 500) {
                this.$Message.warning("概况说明不能超过500个字符！");
                return;
            }
            this.obj.parentId = this.$route.params.parentId;
            this.obj.projectId = this.$route.params.projectId;
            if (this.$route.params.type == 'edit') {
                this.$api.UnitProject.unitTreeEdit(this.obj).then(resp => {
                    if (resp.code == 200) {
                        this.$Message.success(resp.message)
                        Utils.$emit('unitEdit', 'msg')
                        this.closetab()
                        this.$router.push({
                            name: 'unit-project',
                        })
                    } else {
                        this.$Message.warning(resp.message)
                    }
                })
            } else {
                this.$api.UnitProject.unitTreeAdd(this.obj).then(resp => {
                    if (resp.code == 200) {
                        this.$Message.success(resp.message)
                        this.closetab()
                        this.$router.push({
                            name: 'unit-project'
                        })
                    } else {
                        this.$Message.warning(resp.message)
                    }
                })
            }
        },
        changeProvince(id) {},
        changeCity(id) {}
    }
}
</script>

<style scoped>
.jg-name {
    width: 100%;
    height: 40px;
    line-height: 40px;
    display: block;
}
</style>
